import { ref }         from "vue"
import { defineStore } from "pinia"

export const useAppStore = defineStore("app", () => {
    let isCollapse        = ref(false) // 侧边栏是否收缩展示
    let contentFullScreen = ref(false) // 内容是否可全屏展示
    let showLogo          = ref(true) // 是否显示Logo
    let fixedTop          = ref(false) // 是否固定顶部 todo，暂未使用
    let showTabs          = ref(true) // 是否显示导航历史
    let expandOneMenu     = ref(true) // 一次是否只能展开一个菜单
    let elementSize       = ref("small") // element默认尺寸，支持官网'large / default /small'小参数
    let lang              = ref("") // 默认采用的国际化方案,初次进入，采用浏览器当前设置的语言，默认采用中文
    let menuList          = ref([])
    let theme             = ref({
        state: {
            style       : "default",
            primaryColor: "#409eff",
            menuType    : "side",
        },
    })
    
    const createStateChange = (state) => (value) => {
        state.value = value
    }
    
    return {
        isCollapse,
        contentFullScreen,
        showLogo,
        fixedTop,
        showTabs,
        expandOneMenu,
        elementSize,
        lang,
        menuList,
        theme,
        
        isCollapseChange       : createStateChange(isCollapse),
        contentFullScreenChange: createStateChange(contentFullScreen),
        showLogoChange         : createStateChange(showLogo),
        fixedTopChange         : createStateChange(fixedTop),
        showTabsChange         : createStateChange(showTabs),
        expandOneMenuChange    : createStateChange(expandOneMenu),
        elementSizeChange      : createStateChange(elementSize),
        langChange             : createStateChange(lang),
        menuListChange         : createStateChange(menuList),
        themeChange            : createStateChange(theme),
    }
})
